<template>
    <div id="mains">
       <mt-header fixed :title="selected"></mt-header><br><br>
    <div v-for="(v,index) in getArr1" :key="index">
        <van-card
  :price="v.gender"
  :desc="v.phone"
  :title="v.name"
  :thumb="v.avaUrl"
>
  <template #footer>
    <van-stepper v-model="v.num"  theme="round" button-size="22" disable-input @plus="plus(v)" @minus="minus(v)" max="200" min="0"/>
  </template>

</van-card>
        </div>
        <van-submit-bar class="van1" :price="getAllmoney" button-text="提交订单" @submit="onSubmit" />
        <div class="d5"><br><br><br><br><br><br></div>
    </div>
    
</template>
<script>
import Vue from 'vue';
import { SubmitBar } from 'vant';
Vue.use(SubmitBar);
export default {
    
    name:"cart",
    data() {
        return {
          value:false,
          selected:"购物车",
          Allmoney:"",
        }
    },
    methods: {
        plus(v){
            //add
            console.log("add");
            this.$store.commit("add",v)
        },
        minus(v){
            //reduce
            if(v.num>=1){ 
            console.log("reduce");
            this.$store.commit("raduce",v);
            }
            if(v.num<1){
            this.$store.commit("deleta",v);
            console.log(v.num)
            }
            
            
        },
        /* add(v){
            
        },
        raduce(v){
           
        }, */
        change(v){
            this.$store.commit("change",v);
        },
        deleta(v){
            this.$store.commit("deleta",v)
        },
        onSubmit(){

        }
    },   
    mounted() {

    },
    computed: {
    getNum:{
        get(){
          
        },
        set(v){
            this.$store.commit("change",v)
        }
    },
    getArr1(){
        return this.$store.state.arr1;
    },
    getAllmoney(){
        return this.$store.getters.getAllmoney;
    }
  },
}
</script>
<style scoped>
.van1{
    margin-bottom: 13%;
}
</style>